<template>
    <div @dragenter="dragEnter" @drop="drop" @dragleave="dragLeave" @dragover="dragOver">
        <basic-form :name="props.options.title" :isMust="props.options.mustWrite">
            <div class="wrap">
                <template v-for="(item) in props.options.children" :key="item">
                    <components-render :options="item"></components-render>
                </template>
            </div>
        </basic-form>
    </div>
</template>
    
<script setup>
import componentsRender from '../../drag/componentsRender.vue'
import { ref, watch } from 'vue'
const props = defineProps(['options', 'cIndex'])
const dragEnter = e => {
}
const drop = e => {
    if (!e.target.hasAttribute('componentId')) {
        e.target.setAttribute('componentId', props.options.id)
    }
}
const dragLeave = e => {

}
const dragOver = e => {

}
</script>
    
<style scoped>
.wrap {
    width: 100%;
    height: calc(100% - 50px);
    border: 1px solid red;
}
</style>